<template>
  <Detail-dialog
    modal
    width="35"
    :title="title"
    :show.sync="dialogShow" @close="close" @save="save('dataForm')">
    <el-form  ref="dataForm" :model="dicInfo" label-width="100px" :rules="rules">
      <el-form-item label="业务名称" prop="bizName">
                <template slot="label">
                <span>业务名称</span>
                <el-tooltip content="代表业务类型展示名称" placement="top">
                  <i class="el-icon-question"></i>
                </el-tooltip>
              </template>
          <el-input class="wp-form-280" clearable v-model="dicInfo.bizName" placeholder="业务名称"></el-input>
      </el-form-item>
      <el-form-item  prop="bizValue">
            <template slot="label">
                <span>业务值</span>
                <el-tooltip content="代表业务类型的唯一值，不填写后台可自动生成" placement="top">
                  <i class="el-icon-question"></i>
                </el-tooltip>
              </template>
          <el-input class="wp-form-280" clearable v-model="dicInfo.bizValue" placeholder="业务值"></el-input>
      </el-form-item>
      <el-form-item label="业务类型" prop="bizType">
            <el-select style="width:280px" :disabled="!isCreate" clearable v-model="dicInfo.bizType" placeholder="业务类型">
                <el-option v-for="item in dicTypeOptions" :key="item.bizType" :label="item.bizTypeName" :value="item.bizType"></el-option>
            </el-select>
      </el-form-item>
        <el-form-item label="显示排序" prop="sort">
            <el-input-number  class="wp-form-280" :min="1" :step="1" v-model="dicInfo.sort" placeholder="显示排序"></el-input-number>
        </el-form-item>
            <el-row>
                <el-col :span="12">
                    <el-form-item  label="状态" prop="status">
                        <el-tooltip :content="status==1?'启用':'禁用'" placement="top">
                        <el-switch
                            v-model="status"
                            :active-value="1"
                            :inactive-value="0">
                        </el-switch>
                        </el-tooltip>
                    </el-form-item>
                </el-col>
              </el-row>
    </el-form>
    <el-alert v-if="!isCreate" :closable="false" title="基础信息配置请谨慎修改" type="warning"></el-alert>
  </Detail-dialog>
</template>

<script>
import DetailDialog from '@/components/DetailDialog'
import system from '@/api/system'
export default {
  components: {DetailDialog},
  props: {
    isCreate: {type: Boolean, default: true},
    visible: Boolean,
    title: String,
    data: Object,
    dicTypeOptions: Array
  },
  watch: {
    visible: {
      handler (val) {
        this.dialogShow = val
        if (this.isCreate) {
          this.dicInfo.sort = 1
        } else {
          if (val) {
            this.getDicDetailInfo(this.data.bizCode)
          }
        }
      },
      immediate: true
    },
    dialogShow (val) {
      if (val === false) {
        this.dicInfo = {}
      }
      this.$emit('update:visible', val)
    }
  },
  data () {
    return {
      dialogShow: false,
      dicInfo: {},
      status: 1,
      rules: {
        bizName: [{ required: true, message: '不能为空', trigger: 'blur' }],
        sort: [{ required: true, message: '不能为空', trigger: 'blur' }],
        bizType: [{ required: true, message: '不能为空', trigger: 'blur' }]
      }
    }
  },
  methods: {
    close () {
      this.dialogShow = false
    },
    getDicDetailInfo (bizCode) {
      system.getDictInfoByBizCodeAPI(bizCode).then(res => {
        if (res.data) {
          this.dicInfo = res.data
          this.status = res.data.status
        }
      })
    },
    save (form) {
      this.$refs[form].validate(validate => {
        if (validate) {
          this.dicInfo.status = this.status
          this.dicInfo.isEdit = 0
          if (this.isCreate) {
            this.dicInfo.sort = 1
            const obj = this.dicTypeOptions.find(v => {
              if (this.dicInfo.bizType === v.bizType) {
                return v
              }
            })
            if (obj) {
              this.dicInfo.bizTypeName = obj.bizTypeName
            }
            system.addDictAPI(this.dicInfo).then(res => {
              this.close()
              this.$store.dispatch('common/RefreshDic')
              this.$emit('afterSave', res)
            })
          } else {
            system.updateDictAPI(this.dicInfo).then(res => {
              this.close()
              this.$store.dispatch('common/RefreshDic')
              this.$emit('afterSave', res)
            })
          }
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
